<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>后台用户管理</title>
<link rel="stylesheet" href="css/user.css">
</head>
<body>
	<div id="user">
		<div class="user_div">
		<form>
			<input type="text" name="searchUser" >
			<input type="submit" value="查询">
		</form>
	</div>
	<div class="user_table">
		<table border="1" width="1200">
			<tr>
				<td>用户ID</td>
				<td>用户名</td>
				<td>密码</td>
				<td>地址</td>
				<td>手机号</td>
				<td>注册时间</td>
				<td>性别</td>
			</tr>
		</table>
		
	</div>
	<div>
		<span>首页</span>
		<span>下一页</span>
		<span>上一页</span>
		<span>尾页</span>
	</div>
	</div>
</body>
<script src="js/jquery.min.js"></script>
<script>
load();
function load(){
	 	var keyword = " ";
	 	$.ajax({
	 		url:"/shopping/getUser.do",
	 		type:"GET",
	 		data:{
				"pageNum":1,
	 			"pageSize":10,
	 			"keyword":keyword
	 		},
	 		success:function(data){
	 			console.log(data);
	 			var user = data.data;
				for(var i = 0;i < user.length;i++){
	 				var g = user[i];
	 				var $tr = $("<tr></tr>");
	 				var $input1 = $("<input type='text' name='userId' class='userId'>").val(g.userId);
					var $input2 = $("<input type='text' name='userName' class='userName'>").val(g.userName);
					var $input3 = $("<input type='text' name='passWord' class='passWord'>").val(g.passWord);
	 				var $input4 = $("<input type='text' name='address' class='address'>").val(g.address);
	 				var $input5 = $("<input type='text' name='phone' class='phone'>").val(g.phone);
	 				var $input6 = $("<input type='text' name='userSex' class='userSex'>").val(g.userSex);
	 				var $input8 = $("<input type='button' value='删除'>").click(function(){
	 					$.ajax({
	 						url:"/shopping/updateUser.do",
	 						type:"GET",
	 						data:{
	 							"userId":g.userId,
	 							"keyword":"删除"
	 						},
	 						success:function(data){
	 							alert("删除成功");
	 						}
	 					});
	 				});
	 				var $input9 = $("<input type='button' value='修改'>").click(function(event){
	 					
	 					$input9.val("确认").click(function(){
	 						var userName = $(".userName").val();
	 						var passWord = $(".passWord").val();
	 						var address = $(".address").val();
	 						var phone = $(".phone").val();
	 						var userSex = $(".userSex").val();
	 						$.ajax({
	 							url:"/shopping/updateUser.do",
	 							type:"GET",
	 							data:{
	 								"userId":g.userId,
	 								"userName":userName,
	 								"passWord":passWord,
	 								"address":address,
	 								"phone":phone,
	 								"userSex":userSex
	 							},
	  							success:function(data){
	 							alert("更改成功");
	  							}	
	 						});
	 					});
	 				});
	 			var $td1 = $("<td></td>").append($input1);
	 			var $td2 = $("<td></td>").append($input2);
	 			var $td3 = $("<td></td>").append($input3);
	 			var $td4 = $("<td></td>").append($input4);
	 			var $td5 = $("<td></td>").append($input5);
	 			var $td6 = $("<td></td>").append($input6);
	 			var $td8 = $("<td></td>").append($input8,$input9);
	 			$tr.append($td1,$td2,$td3,$td4,$td5,$td6,$td8);
				$("table").append($tr);
	 			}
	 		}
	 	})
	 	$("input").css({
	 		width:"80px"
	 	})
	 }
</script>
</html>